<template>
<div class="all-css">
  <div>
    <div class="title" >
      网站介绍
    </div>
  </div>
   <div class="content">
     网站简介: 这是一个用于易经学习和基础术数体验的网站。当然该网站还处于初期阶段，还有许多的功能需要完善，
     也有许多有待上线的功能。现在网站大致可以有以下5个功能板块: (1)首先是登录注册板块，用户可以在网站上实现注册并登录。
     需要说明的是网站中的许多功能都是用户登录后才能使用的。(2)其次是易经术数的体验模块, 用户可以在其中体验到易经记载的术数，占卜吉凶，
     需要强调的这些术数在后端的实现并不是简单的随机，而是通过了在后端代码进行了具体的算法模拟。(3)而后是易经的学习板块，
     学习板块可以分为易经典籍的学习板块和 搜索板块，用户可以通过点击第二个按钮(古典或搜索)进行切换，(4)最后一个板块是聊天板块，用户可以首页下 打开YIChat 按钮，
     打开聊天板块，在这里可以和好友聊天 ，同时点击" + "号按钮添加好友，暂时仅支持添加好友，不支持群聊。需要说明的是在正常注册，登录后将会看到好友列表下会自动出现 "manji" 好友
     ，这是 "我" 也就是网站的开发者,这里遇到任何疑问，都可以通过直接沟通聊天的方式联系"我"。我将第一时间回答你的问题。 (5)最后是关于实现显示用户的在线人数的功能。
   </div>

  <div class="content" >
    技术实现: 下面需要说明的是该网站的技术实现，及一些有趣的技术处理方案，(1) 首先是前端技术，该网站前端技术使用Vue.js + Element-ui + Axios ,图标采用的是 阿里巴巴的iconfont.css 。
    后端使用的java的常用框架 springboot ,后端的持久化使用的是 mysql + mybatis ,缓存方面使用的是 redis, 当然也使用了 JDK自带的 currentHashMap 的方式 实现token缓存。
    (2) 关于聊天板块，该网站使用的是websocket技术，后端通过权限确认，建立与服务端的webSocket的连接 等 一系列的方式实现了用户间一对一的聊天功能。而在之后  (3) 关于搜索使用的sql语句中的模糊查询， 这在后期会被改成ElasticSearch的实现方式。
    (4) 最后是关于实现显示用户的在线人数的功能，该网站使用的是redis作为缓存，在redis中存储了token和用户在线人数的映射关系，
    当用户登录时，会将token存入redis中，当用户退出登录时，会将token从redis中删除，同时更新在线人数。
   </div>


  <div class="content"  style="height: 200px;" >
     网站开发者:
  </div>


</div>
</template>
<script>
export default {
  name: "webIntri"
}
</script>
<style scoped>

.title{
  width: 100%;
  height: 100px;
}
.content{
  font-size: 15px;
  width: 90%;
  line-height: 32px;
  margin: 20px auto;
  height: 320px;
  background-color: #bbd5b9;
}

.all-css{
  font-family: "Britannic Bold", serif;
  font-size: 20px;
  width: 60%;
  margin: 0 auto;
  height: 1100px;
  background-color: #eaefea;
}

</style>